﻿@{
    ViewBag.Title = "Handvn";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
@model handvn.Models.ProductView 
<script src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
<script>
$(document).ready(function() {
	$("aside.preview nav_prod").show();
	var previewImg = $("img#main_prod");
	$("a:first").addClass("active");
	$("nav_prod a img").click(function(){
		var link = $(this).parent();	
		var linkHref = link.attr("href");			
		var linkAlt = link.attr("alt");			
		if( $(link).hasClass("active") == false)
		{
			$("a").removeClass("active");
			link.addClass("active");											
			$(previewImg).animate({
				opacity: 0.8,
			}, 300, function() {
				previewImg.attr("src", linkHref);
				previewImg.attr("alt", linkAlt);				
				$(this).animate({
					opacity: 1,
					}, 300
				);							
			});			
		}
		return false;
	});
	$("input").click(function(){
		$("p.more").fadeIn("slow");
	})

    
});
</script>
<script>
    function myAlert() {
        alert("Chức năng đang được xây dựng!\nBạn hãy liên hệ trực tiếp Shop để mua sản phẩm.");
    }
</script>
<div class="tl_content">
    <script type="text/javascript">
        
    </script>
    <div class="tl_detail_product_left">
        @foreach (var item in Model.Product)
        {
            <h2>@item.TenSanPham</h2>
            <br />
@*<img class="tl_detail_product_img" src="../../Images/HinhAnh/@item.HinhAnh" alt=""/>*@
            <aside class="preview">
		<img id="main_prod" src="../../Images/HinhAnh/@item.HinhAnh" width="500" height="550" alt="Alt title of image"/>
		<nav_prod>
            <a class="active" href="../../Images/HinhAnh/@item.HinhAnh"><img src="../../Images/HinhAnh/@item.HinhAnh" width="91" height="75" alt="Side of the shoe"/></a>
            @foreach (var ima in Model.Images)
            {
			    <a  href="../../Images/HinhAnh/@ima.TenHinhAnh"><img src="../../Images/HinhAnh/@ima.TenHinhAnh" width="91" height="73" alt="Side of the shoe"/></a>
            }
			@*<a href="../../Images/HinhAnh/shirt.jpg"><img src="../../Images/HinhAnh/shirt.jpg" width="91" height="73" alt="Front of the shoe"/></a>*@		
					
		</nav_prod>
	</aside>
            <br />
            <div class="tl_detail_product_gioithieu">
                @*-------Display html content in a div tag--------*@
                @Html.Raw(HttpUtility.HtmlDecode(item.GioiThieu))
            </div>
            @*-------Display html comment--------*@
            <div class="tl_detail_product_comment">
                <div class="tl_comment"><hr/><br/>---------Bình luận--------------------</div>
                <div class="fb-comments" data-href="http://handvn.com/product/viewdetail?prod=@item.ProductID" data-width="600"></div>
            </div>
        }
         
    </div>
    <div class="tl_detail_product_right">
        @foreach (var item in Model.Product)
        {
            <h3>
                $@item.GiaSanPham vnd &nbsp; &nbsp; &nbsp;Số lượng:&nbsp;@item.SoLuong</h3>                      
        }
        <div class="tl_box_cart_cont">
            <div class="tl_box_cart">
               @* <form action="#">*@
                <input type="submit" class="tl_button_cart" id="btnCart" onclick="myAlert()" value="Add to Cart" />
               @* </form>*@
            </div>
            <input type="submit" id="btnlike" value="Like" style="width: 70px; text-align: center;
                margin: 10px 0 0 20px;" />
        </div>
        <div class="tl_box_shop">
            <h4>
                Shop owns</h4>
            @foreach (var item in Model.Product)
            {
                <img class="tl_user_img" src="../../Images/HinhAnh/@item.User.HinhAnh" width="60px" height="60px"alt=""/>
                <div class="tl_user_profile">
                    @item.User.TenKhachhang<br />
                    @item.User.DienThoai<br />
                    @item.User.Email<br />
                    @item.User.DiaChi
                </div>                                        
            }
        </div>
        @foreach (var item in Model.Product)
        { <br />
            <br />
            <h3>
                $@item.GiaSanPham vnd &nbsp; &nbsp; &nbsp;Số lượng:&nbsp;@item.SoLuong</h3>                      
        }
        <div class="tl_box_cart_cont">
            <div class="tl_box_cart">
                <input type="submit" class="tl_button_cart" id="btnCart1" onclick="myAlert()" value="Add to Cart" />
            </div>
            <input type="submit" id="btnlike1" value="Like" style="width: 70px; text-align: center;
                margin: 10px 0 0 20px;" />
        </div>
    </div>
</div>
<!-- End Content-->
